// 登录页面

// 1. 登录
const but = document.querySelector('.but')
const nameInp = document.querySelector('.username')
const pwdInp = document.querySelector('.password')
const errBox = document.querySelector('.prompt')

// 1-1. 绑定表单提交事件
but.addEventListener('click', e => {
    e = e || window.event
    // 1-2. 取消默认行为
    e.preventDefault()

    // 1-3. 拿到用户输入的内容
    const name = nameInp.value
    const pwd = pwdInp.value
    // console.log(name);
    // console.log(pwd);

    // 1-4. 验证
    if (!name || !pwd) return alert('请完整填写表单')

    // 1-5. 提交到服务器
    ajax({
    url: 'http://localhost:8888/users/login',
    method: 'POST',
    data: `username=${name}&password=${pwd}`,
    dataType: 'json',
    success (res) {
        // 1-6. 登录完成后的业务逻辑
        if (res.code === 0) {
        // 登录失败
        errBox.style.visibility = 'visible'
        return
        }

        // 登录成功
        // 存储一些信息
        window.localStorage.setItem('id', res.user.id)
        window.localStorage.setItem('token', res.token)
        // console.log(res);
        // 跳转页面
        const url = window.localStorage.getItem('url')
        window.localStorage.removeItem('url')
        window.location.href = `./${ url ? url : 'index' }.html`
    }
    })
})

nameInp.addEventListener('input',() => {
    but.style.backgroundColor = 'tomato'
    if(!nameInp.value){
        but.style.backgroundColor = '#dadada'
    }
})
